<template>
    <div class="pagestyle">
        <list_controller ref="zujianname" :options="state.options" :noprintDownShow="true">
            <template v-slot:opraCurdBtnlist="row">
                <span>
                    <el-button class="tableFontSize" type="primary" link size="small" @click="lookBtn(row.row.row)">
                        显示电流、电压信息</el-button>
                </span>
            </template>
            <template v-slot:selectNamelist>
                传感器电压信息
            </template>
        </list_controller>
        <!-- 详情 -->
        <el-drawer v-model="state.drawerShow" direction="rtl" size="40%" close-on-click-modal :modal="true">
            <template #header="{ close, titleId, titleClass }">
                <h4 class="mask_sub_title">
                    <svg-icon class-name="search-icon" icon-class="biaotitubiao" /><span>传感器电流、电压信息</span></h4>
            </template>
            <p class="drawer_sub_title">
                <span class="sub_title_line">基础信息</span>
            </p>
            <detailCom :descList="state.descList"></detailCom>
            <p class="drawer_sub_title" style="display: flex;justify-content: space-between;align-items: center;">
                <span class="sub_title_line">电流、电压值</span>
                <el-button type="text" @click="getdianyClick">获取电压、电流数据</el-button>
            </p>
            <detailCom :descList="state.descListsub"></detailCom>
        </el-drawer>
    </div>
</template>
<script setup>
    import list_controller from "@/components/commonCom/list_controller";
    import detailCom from "@/components/commonCom/detailCom";
    import {
        computed,
        reactive
    } from "vue";
    import {
        table_headers
    } from '@/components/commonCom/table_headers';
    import axios from "@/utils/request"
    import usePagesStore from '@/store/modules/pages'
    const {
        proxy
    } = getCurrentInstance();
    const store = usePagesStore()
    const router = useRouter();
    let previewHttps =
        import.meta.env.VITE_APP_HTTP
    components: {
        list_controller
    }
    const upload = ref(null)
    let state = reactive({
        options: {
            queryList: {
                querys: []
            },
            tableheads: computed(() => table_headers.realPointInfo),
            dataUrl: '/current/voltage/listRealPointInfo',
            descUrl: '/current/voltage/listRealPointInfo'
        },
        // 表单
        drawerShow: false,
        descList: [],
        descListsub: [],
        pointId: undefined
    })
    // 查看按钮
    function lookBtn(row) {
        state.drawerShow = true
        state.descListsub = [{
            name: '更新时间',
            value: '-',
            col: 12
        }, {
            name: '电流值',
            value: '-',
            col: 6
        }, {
            name: '电压值',
            value: '-',
            col: 6
        }]
        state.pointId = row.pointId
        axios.post(state.options.descUrl, {
            pageNum: 1,
            pageSize: 10,
            pointId: row.pointId
        }).then(res => {
            if (res.code == 200) {
                state.descList = [{
                    name: '分站号',
                    value: res.data.list[0].stationCode,
                    col: 8
                }, {
                    name: '测点号',
                    value: res.data.list[0].pointId,
                    col: 8
                }, {
                    name: '类型',
                    value: res.data.list[0].pointType,
                    col: 8,
                    color: 'rgba(64, 158, 255, 1)'
                }, {
                    name: '名称',
                    value: res.data.list[0].sensorName,
                    col: 8
                }, {
                    name: '安装位置',
                    value: res.data.list[0].placeName,
                    col: 16
                }]
            }
        })

    }

    function getdianyClick() {
        axios.post('/current/voltage/list', {
            pointId: state.pointId
        }).then(res => {
            state.descListsub = [{
                name: '更新时间',
                value: res.data[0].dataTime,
                col: 12
            }, {
                name: '电流值',
                value: res.data[0].currentValue,
                col: 6
            }, {
                name: '电压值',
                value: res.data[0].voltageValue,
                col: 6
            }]
        })
    }
</script>
<style lang="scss" scoped>
    ::v-deep .el-drawer {
        .querycss {
            .fsc {
                &:nth-child(2) {
                    display: none;
                }
            }
        }

        .table_box {
            .fsc {
                display: none;
            }
        }
    }
</style>